*{
	margin:0;
	padding:0;
}
@font-face{
	font-family:HanyiWenhei-85W;
	src: url(../fonts/HYWenHei-85W-1.ttf);
	}
h1{
	text-align:center;
	color:white;
}
html{ 
	background:url(../images/background.jpg) no-repeat #000  center top fixed; 
	background-size: cover;
	
}
div{
	color:white;
	font-family:HanyiWenhei-85W;
}
.index{
	position: absolute;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,0.3);
}
.main{
	position: absolute;
	border-radius:10px;
	top:20px;
	bottom:20px;
	left:20px;
	right:20px;
	display:flex;
	background-color:rgba(0,0,0,0.3);
	backdrop-filter: blur(7px);
}
.character{
	position: relative;
	background-color:rgba(0,0,0,0.3);
	border-radius:100px;
	width:200px;
	height:200px;
	border-style:solid;
	border-width:2px;
	border-color:white;
	
}

.introduce{
	padding:10px;
	border-radius:10px;
	backdrop-filter: blur(7px);
	width:calc(100% - 240px);
	background-color:rgba(0,0,0,0.1);
	
	
}
.sidebar{
	padding:10px;
	backdrop-filter: blur(7px);
	border-radius:10px;
	text-align:center;
	background-color:rgba(0,0,0,0.1);
}
.navigation{
	padding:10px;
	font-size:20px;
	border-radius:10px;
	height:calc(100% - 220px);
	
	
}
li{
	padding:10px 10px;
}
li a{
	text-decoration: none;
	padding:10px 40px;
	border-radius:10px;
	color:white;
	
}
li a:hover{
	background-color:white;
	color:black;
}
img{
	max-height:200px;
	max-width:auto;
}